<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="description"
	content="Creative - Bootstrap 3 Responsive Admin Template">
<meta name="author" content="GeeksLabs">
<meta name="keyword"
	content="Creative, Dashboard, Admin, Template, Theme, Bootstrap, Responsive, Retina, Minimal">
<link rel="shortcut icon" href="houtai/img/favicon.png">

<title>股权结构</title>

<script src="js/jquery.min.js"></script>
<script src="js/jquery.easyui.min.js"></script>
<script src="js/easyui-lang-zh_CN.js"></script>

<script type="text/javascript">
$.ajax({
	url : 'GetCorpNameServlet.com',
	type : 'GET',
	dataType : 'text',
	timeout : 2000,
	error : function() {
		$.messager.alert("错误", "执行错误");
	}, //错误执行方法
	success : function(result) {
		var company_name = (new Function("", "return " + result))();;
		$().ready(function() {
			$("#company_name").autocomplete(company_name, {
				max : 5, //列表里的条目数  
				width : 500, //提示的宽度，溢出隐藏  
				scrollHeight : 150, //提示的高度，溢出显示滚动条  
				matchContains : false, //包含匹配，就是data参数里的数据，是否只要包含文本框里的数据就显示  
				autoFill : false
			//是否自动填充  
			});
		});
	}
})	
</script>
<!-- Bootstrap CSS -->
<link href="houtai/css/bootstrap.min.css" rel="stylesheet">
<!-- bootstrap theme -->
<link href="houtai/css/bootstrap-theme.css" rel="stylesheet">
<!--external css-->
<!-- font icon -->
<link href="houtai/css/elegant-icons-style.css" rel="stylesheet" />
<link href="houtai/css/font-awesome.min.css" rel="stylesheet" />
<!-- full calendar css-->
<link
	href="houtai/assets/fullcalendar/fullcalendar/bootstrap-fullcalendar.css"
	rel="stylesheet" />
<link href="houtai/assets/fullcalendar/fullcalendar/fullcalendar.css"
	rel="stylesheet" />
<!-- easy pie chart-->
<link
	href="houtai/assets/jquery-easy-pie-chart/jquery.easy-pie-chart.css"
	rel="stylesheet" type="text/css" media="screen" />
<!-- owl carousel -->
<link rel="houtai/stylesheet" href="css/owl.carousel.css"
	type="text/css">
<link href="houtai/css/jquery-jvectormap-1.2.2.css" rel="stylesheet">
<!-- Custom styles -->
<link rel="stylesheet" href="houtai/css/fullcalendar.css">
<link href="houtai/css/widgets.css" rel="stylesheet">
<link href="houtai/css/style.css" rel="stylesheet">
<link href="houtai/css/style-responsive.css" rel="stylesheet" />
<link href="houtai/css/xcharts.min.css" rel=" stylesheet">
<link href="houtai/css/jquery-ui-1.10.4.min.css" rel="stylesheet">
<link rel="stylesheet" href="css/jquery.autocomplete.css" type="text/css" />
<!-- HTML5 shim and Respond.js IE8 support of HTML5 -->
<!--[if lt IE 9]>
      <script src="js/html5shiv.js"></script>
      <script src="js/respond.min.js"></script>
      <script src="js/lte-ie7.js"></script>
    <![endif]-->
<script type="text/javascript"
	src="http://echarts.baidu.com/gallery/vendors/echarts/echarts.min.js"></script>
<script type="text/javascript"
	src="http://echarts.baidu.com/gallery/vendors/echarts-gl/echarts-gl.min.js"></script>
<script type="text/javascript"
	src="http://echarts.baidu.com/gallery/vendors/echarts-stat/ecStat.min.js"></script>
<script type="text/javascript"
	src="http://echarts.baidu.com/gallery/vendors/echarts/extension/dataTool.min.js"></script>
<script type="text/javascript"
	src="http://echarts.baidu.com/gallery/vendors/echarts/map/js/china.js"></script>
<script type="text/javascript"
	src="http://echarts.baidu.com/gallery/vendors/echarts/map/js/world.js"></script>
<script type="text/javascript"
	src="http://api.map.baidu.com/api?v=2.0&ak=ZUONbpqGBsYGXNIYHicvbAbM"></script>
<script type="text/javascript"
	src="http://echarts.baidu.com/gallery/vendors/echarts/extension/bmap.min.js"></script>
<script type="text/javascript"
	src="http://echarts.baidu.com/gallery/vendors/simplex.js"></script>
<script type="text/javascript">
	$(function() {
		KISSY.use('wltaoMFD', function(a, b) {
			var mfd = new b;
			mfd.init();
		});
	});
</script>
<script>
	$('#test2').on('click', function() {
		layer.open({
			type : 1,
			area : [ '600px', '360px' ],
			shadeClose : true, //点击遮罩关闭
			content : '\&lt;\div style="padding:20px;"&gt;自定义内容\&lt;\/div&gt;'
		});
	});
</script>

<script type="text/javascript">
	$.ajax({
		url : 'GetShareholderServlet.com',
		type : 'GET',
		dataType : 'text',
		// 			timeout : 2000,
		error : function() {
			$.messager.alert("错误", "执行错误");
		}, //错误执行方法
		success : function(result) {
			var array = result.split("+");

			var str1 = array[0];
			var str2 = array[1];
			var str3 = array[2];
			var str4 = array[3];
			var str5 = array[4];

			var url = "GetCorpInfoServlet.com?company_name=" + str5;
			document.getElementById("links").href = url;

			var json1 = (new Function("", "return " + str1))();

			var data_x = [];
			for (var i = 0; i < json1.length; i++) {
				data_x[i] = json1[i].name;
			}

			var json2 = (new Function("", "return " + str2))();
			var json3 = (new Function("", "return " + str3))();
			var json4 = (new Function("", "return " + str4))();

			var myChart = echarts.init(document.getElementById("main"));
			/* var myChart1 = echarts.init(document.getElementById('"slave"'));
			 */
			var app = {};

			var option = {
				title : {
					x : "center",
					text : '股东占股比例图'
				},
				tooltip : {
					trigger : 'item',
					formatter : "{a} <br/>{b}: {c} ({d}%)"
				},
				legend : {
					orient : 'vertical',
					x : 'left',
					data : data_x
				},
				series : [
						{
							name : '股东类型',
							type : 'pie',
							selectedMode : 'single',
							radius : [ 0, '30%' ],

							label : {
								normal : {
									position : 'inner'
								}
							},
							labelLine : {
								normal : {
									show : false
								}
							},
							data : json2
						},
						{
							name : '股东占股情况',
							type : 'pie',
							radius : [ '40%', '55%' ],
							label : {
								normal : {
									formatter : '{a|{a}}{abg|}\n{hr|}\n  {b|{b}：}{c}  {per|{d}%}  ',
									backgroundColor : '#eee',
									borderColor : '#aaa',
									borderWidth : 1,
									borderRadius : 4,
									rich : {
										a : {
											color : '#999',
											lineHeight : 22,
											align : 'center'
										},
										hr : {
											borderColor : '#aaa',
											width : '100%',
											borderWidth : 0.5,
											height : 0
										},
										b : {
											fontSize : 16,
											lineHeight : 33
										},
										per : {
											color : '#eee',
											backgroundColor : '#334455',
											padding : [ 2, 4 ],
											borderRadius : 2
										}
									}
								}
							},
							data : json3
						} ]
			};
			;
			if (option && typeof option === "object") {
				myChart.setOption(option, true);
			}

			var myChart1 = echarts.init(document
					.getElementById("slave"));
			var option1 = {
				tooltip : {},
				animationDurationUpdate : 1500,
				animationEasingUpdate : 'quinticInOut',
				label : {
					normal : {
						show : true,
						textStyle : {
							fontSize : 12
						},
					}
				},
				series : [ {
					type : 'graph',
					layout : 'force',
					symbolSize : 70,
					focusNodeAdjacency : true,
					roam : true,
					label : {
						normal : {
							show : true,
							textStyle : {
								fontSize : 12
							},
						}
					},
					force : {
						repulsion : 100
					},
					edgeSymbolSize : [ 4, 10 ],
					edgeLabel : {

						normal : {
							show : true,
							textStyle : {
								fontSize : 20
							},
							formatter : "{c}"
						}
					},
					data : json4,
					// links: [],
					links : [ {
						source : 0,
						target : 1,
						value : '疑似实际控股人',
					} ],
					lineStyle : {
						normal : {
							opacity : 0.9,
							width : 2,
							curveness : 0
						}
					}
				} ]
			};

			myChart1.setOption(option1);

		}
	})
</script>

</head>

<style type="text/css">
.headroom {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	transition: all .2s ease-in-out;
}

.headroom--unpinned {
	top: -100px;
}

.headroom--pinned {
	top: 0;
}
</style>

<script type="text/javascript">
	$(".navbar-fixed-top").headroom();
</script>

<body>
	<!-- container section start -->
	<section id="container">


		<header class="header dark-bg" style="padding-left: 22%">
			<div class="toggle-nav">
				<div class="icon-reorder tooltips"
					data-original-title="Toggle Navigation" data-placement="bottom"></div>
			</div>

			<!--logo start-->
			<a class="navbar-brand" href="index.jsp">企业信息族谱分析</a>
			<!--logo end-->

			<div class="nav search-row" id="top_menu">
				<!--  search form start -->
				<ul class="nav top-menu">
					<li>
						<form class="navbar-form" action="GetCorpInfoServlet.com"
							method="get">
							<input class="form-control" placeholder="请输入企业名称..."
								type="text" id="company_name" name="company_name"
								style="width: 300px">
							<button type="submit" class="btn btn-info btn-sm">查一下</button>
						</form>
					</li>
				</ul>
				<!--  search form end -->
			</div>
		</header>
		<!--header end-->

		<!--sidebar start-->
		<!--sidebar end-->

		<!--main content start-->
		<section id="main-content">
			<section class="wrapper">
				<!--overview start-->
				<div class="row">
					<div class="col-lg-12">
						
						<ol class="breadcrumb">
							<li><i class="fa fa-laptop"></i><a href="" id="links">基本信息</a></li>
							<li><i class="fa fa-laptop"></i><a href="tu_1.html">股权结构</a></li>
							<li><i class="fa fa-laptop"></i><a href="tu_2.html">投资族谱</a></li>
							<li><i class="fa fa-laptop"></i><a href="tu_3.html">企业图谱</a></li>
							<li><i class="fa fa-laptop"></i><a href="tu_4.html">疑似关系</a></li>
						</ol>
					</div>
				</div>



				<div id="slave" style="width: 100%; height: 150px;"></div>
				<div id="main" style="width: 100%; height: 650px;"></div>




			</section>
		</section>
		<!--main content end-->
	</section>
	<!-- container section start -->

	<!-- javascripts -->
	<script src="houtai/js/jquery.js"></script>
	<script src="houtai/js/jquery-ui-1.10.4.min.js"></script>
	<script src="houtai/js/jquery-1.8.3.min.js"></script>
	<script type="text/javascript"
		src="houtai/js/jquery-ui-1.9.2.custom.min.js"></script>
	<!-- bootstrap -->
	<script src="houtai/js/bootstrap.min.js"></script>
	<!-- nice scroll -->
	<script src="houtai/js/jquery.scrollTo.min.js"></script>
	<script src="houtai/js/jquery.nicescroll.js" type="text/javascript"></script>
	<!-- charts scripts -->
	<script src="houtai/assets/jquery-knob/js/jquery.knob.js"></script>
	<script src="houtai/js/jquery.sparkline.js" type="text/javascript"></script>
	<script
		src="houtai/assets/jquery-easy-pie-chart/jquery.easy-pie-chart.js"></script>
	<script src="houtai/js/owl.carousel.js"></script>
	<!-- jQuery fhoutai/ull calendar -->
	<script src="houtai/js/fullcalendar.min.js"></script>
	<!-- Full Google Calendar - Calendar -->
	<script src="houtai/assets/fullcalendar/fullcalendar/fullcalendar.js"></script>
	<!--script for this page only-->
	<script src="houtai/js/calendar-custom.js"></script>
	<script src="houtai/js/jquery.rateit.min.js"></script>
	<!-- custom select -->
	<script src="houtai/js/jquery.customSelect.min.js"></script>
	<script src="houtai/assets/chart-master/Chart.js"></script>

	<!--custome script for all page-->
	<script src="houtai/js/scripts.js"></script>
	<!-- custom script for this page-->
	<script src="houtai/js/sparkline-chart.js"></script>
	<script src="houtai/js/easy-pie-chart.js"></script>
	<script src="houtai/js/jquery-jvectormap-1.2.2.min.js"></script>
	<script src="houtai/js/jquery-jvectormap-world-mill-en.js"></script>
	<script src="houtai/js/xcharts.min.js"></script>
	<script src="houtai/js/jquery.autosize.min.js"></script>
	<script src="houtai/js/jquery.placeholder.min.js"></script>
	<script src="houtai/js/gdp-data.js"></script>
	<script src="houtai/js/morris.min.js"></script>
	<script src="houtai/js/sparklines.js"></script>
	<script src="houtai/js/charts.js"></script>
	<script src="houtai/js/jquery.slimscroll.min.js"></script>
	<script src="houtai/js/headroom.min.js"></script>
	<script src="houtai/js/jQuery.headroom.js"></script>
	<script type="text/javascript" src='layer/layer.js'></script>

	<script type="text/javascript" src="js/jquery.autocomplete.min.js"></script>

<script type="text/javascript">
$.ajax({
	url : 'GetCorpNameServlet.com',
	type : 'GET',
	dataType : 'text',
	timeout : 2000,
	error : function() {
		$.messager.alert("错误", "执行错误");
	}, //错误执行方法
	success : function(result) {
		var company_name = (new Function("", "return " + result))();;
		$().ready(function() {
			$("#company_name").autocomplete(company_name, {
				max : 5, //列表里的条目数  
				width : 500, //提示的宽度，溢出隐藏  
				scrollHeight : 150, //提示的高度，溢出显示滚动条  
				matchContains : false, //包含匹配，就是data参数里的数据，是否只要包含文本框里的数据就显示  
				autoFill : false
			//是否自动填充  
			});
		});
	}
})	
</script>


	<script>
		//获取页面元素
		var myElement = document.querySelector("header");
		// 创建 Headroom 对象，将页面元素传递进去
		var headroom = new Headroom(myElement);
		// 初始化
		headroom.init();
	</script>
	<script>
		$('#test2').on('click', function() {
			layer.open({
				type : 1,
				area : [ '600px', '360px' ],
				shadeClose : true, //点击遮罩关闭
				content : '<a >'
			});
		});
		$('#parentIframe').on('click', function() {
			layer.open({
				type : 2,
				title : 'iframe父子操作',
				maxmin : true,
				shadeClose : true, //点击遮罩关闭层
				area : [ '800px', '520px' ],
				content : 'index.jsp'
			});
		});
	</script>
</body>
</html>
